.flex {
  display: flex;

  &-center {
    display: flex;
    align-content: center;
    justify-content: center;
  }

  &-jc-center {
    justify-content: center;
  }

  &-jc-start {
    justify-content: start;
  }

  &-ac-center {
    align-content: center;
  }
}

.mg-auto {
  margin-left: auto;
  margin-right: auto;
}

.pointer {
  cursor: pointer;
}

.jt {
  &-button {
    display: inline-block;
    padding: 10px 24px;
    border: 0;
    border-radius: 12px;
    box-shadow: 0px 0px 3px #35aafc;
    color: #35aafc;
    &:hover {
      background-color: #a1d8ff;
    }
  }

  &-sidebar {
    width: 200px;
    background-color: #f8f8f8;
    padding-bottom: 1px;
    padding-right: 1px;
    &-item {
      width: 200px;
      overflow: hidden;
      box-shadow: 1px 1px 0px 0px #e5e5e5;
      padding: 12px;
      box-sizing: border-box;
      &:hover {
        background-color: #35aafc;
        color: #fff;
        box-shadow: 1px 1px 5px 1px #35aafc;
        transform: scale(1.05);
      }
    }
  }

  &-text {
    color: #666;
    &-dark {
      color: #eee;
    }
    &-important {
      color: #f73131;
    }

    &-overflow-hidden {
      &-1 {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
      }
    }
  }
}
